<template>
  <div class="school_rate_setting">
    <div class="header_title">
      <span>学校费率</span>
    </div>
    <el-form
      ref="form"
      :model="form"
      label-width="150px"
      class="parameter_mian"
      :disabled="!isauth('package_edit')"
    >
      <el-form-item label="计费方式:" style="borderBottom:1px dashed #ccc;marginBottom:0px;">
        <el-radio-group v-model="form.chargeType">
          <el-radio label="0">按分钟计算</el-radio>
          <el-radio label="1">按秒钟计算</el-radio>
          <el-radio label="2">按次计算</el-radio>
        </el-radio-group>
        <span class="introduced">1、按通话分钟计算时，则不足一分钟，按一分钟计；2、按次计算，每次通话产生固定费用；</span>
      </el-form-item>
      <el-form-item label="费率:" style="borderBottom:1px dashed #ccc;">
        <el-col :span="3">
          <el-input v-model="form.minuteCost" size="mini"  @keyup.native="keyupEvent($event,'minuteCost')"></el-input>
        </el-col>
        <span class="jjdw-new">*单位:元,且最多保留两位小数</span>
      </el-form-item>
      <el-form-item label="最大通话时间:" style="borderBottom:1px dashed #ccc;">
        <el-col :span="3">
          <el-input v-model="form.maximumCallTime" size="mini" oninput="value=value.replace(/[^\d]/g,'')"></el-input>
        </el-col>
        <span class="dwfz">*单位:分钟(仅对按次收费有效；且计费方式为近次计费时，该值必须维护；)，大于0的整数。</span>
      </el-form-item>
      <el-form-item label="开通功能:" style="borderBottom:1px dashed #ccc;">
        <el-col :span="2">
          <el-checkbox v-model="form.useFamilyNumber">开通亲情模式</el-checkbox>
        </el-col>
        <el-col :span="4" style="marginLeft:100px">亲情号码最大数量:</el-col>
        <el-col :span="3">
          <el-input
            v-model="form.familyNumberCount"
            :disabled="form.useFamilyNumber==true?false:true"
            size="mini"
            oninput="value=value.replace(/[^\d]/g,'')"
          ></el-input>
        </el-col>
        <span class="dwfz">*亲情号码数量合法范围为1~10</span>
        <!-- <el-col :span="8">
                  <el-col :span="8" style="marginLeft:50px">亲情号码最大数量:</el-col>
                  <el-col :span="10">
                    <el-input v-model="form.familyNumberCount" :disabled="form.useFamilyNumber==true?false:true" size="mini"></el-input>
                  </el-col>  
        </el-col>-->
      </el-form-item>
      <el-form-item label="资费模式:" style="borderBottom:1px dashed #ccc;">
        <el-col :span="3">
          <el-select v-model="form.packageType" placeholder="请选择" size="mini">
            <el-option
              v-for="item in packageTypeoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-col>
        <el-col :span="4">
          <div v-if="form.packageType==='0'" style="marginLeft:10px">元/分钟</div>
          <div v-if="form.packageType==='1'" style="marginLeft:10px">
            <el-col :span="10">
              <el-input size="mini" v-model="form.monthlyRent"></el-input>
            </el-col>
            <el-col :span="10" style="marginLeft:10px">
              <span>元/月</span>
            </el-col>
          </div>
        </el-col>
      </el-form-item>
      <el-form-item label="赠送方式:" style="borderBottom:1px dashed #ccc;">
        <el-col :span="3">
          <el-select v-model="form.freeWay" placeholder="请选择" size="mini">
            <el-option
              v-for="item in freeWayoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-col>
        <el-col :span="1" style="marginLeft:10px">赠送</el-col>
        <el-col :span="19">
          <el-col :span="3">
            <el-input v-model="form.freeTime" class="freetime" size="mini" oninput="value=value.replace(/[^\d]/g,'')"></el-input>
          </el-col>
          <el-col :span="21">分钟 开通订购业务时，将不使用赠送</el-col>
        </el-col>
        <el-col :span="24" v-if="form.freeWay==='1'" class="monselcet">
          <el-checkbox v-model="form.jan01" label="1月份">1月份</el-checkbox>
          <el-checkbox v-model="form.feb02" label="2月份">2月份</el-checkbox>
          <el-checkbox v-model="form.mar03" label="3月份">3月份</el-checkbox>
          <el-checkbox v-model="form.apr04" label="4月份">4月份</el-checkbox>
          <el-checkbox v-model="form.may05" label="5月份">5月份</el-checkbox>
          <el-checkbox v-model="form.june06" label="6月份">6月份</el-checkbox>
          <el-checkbox v-model="form.july07" label="7月份">7月份</el-checkbox>
          <el-checkbox v-model="form.aug08" label="8月份">8月份</el-checkbox>
          <el-checkbox v-model="form.sept09" label="9月份">9月份</el-checkbox>
          <el-checkbox v-model="form.oct10" label="10月份">10月份</el-checkbox>
          <el-checkbox v-model="form.nov11" label="11月份">11月份</el-checkbox>
          <el-checkbox v-model="form.dec12" label="12月份">12月份</el-checkbox>
        </el-col>
      </el-form-item>
      <el-form-item label="通话时间配置:" style="borderBottom:1px dashed #ccc;">
        <el-time-select
          size="mini"
          placeholder="起始时间"
          v-model="form.allowedStartTime"
          value-format="HH:mm:00"
          :picker-options="{
                    start: '00:00',
                    step: '00:01',
                    end: '23:59'
                  }"
        ></el-time-select>至
        <el-time-select
          size="mini"
          placeholder="结束时间"
          v-model="form.allowedEndTime"
          value-format="HH:mm:00"
          :picker-options="{
                    start: '00:00',
                    step: '00:01',
                    end: '23:59',
                    minTime: form.allowedStartTime
                  }"
        ></el-time-select>
      </el-form-item>
      <el-form-item label="家长是否自行订购:" style="borderBottom:1px dashed #ccc;">
        <el-checkbox v-model="form.selfOrder">开通</el-checkbox>
      </el-form-item>
      <el-form-item label="备注:" style="borderBottom:1px dashed #ccc;">
        <el-col :span="8" style="marginTop:10px;marginBottom:10px">
          <el-input
            type="textarea"
            :autosize="{ minRows: 4, maxRows: 8}"
            placeholder
            :rows="8"
            v-model="form.remark"
          ></el-input>
        </el-col>
      </el-form-item>
    </el-form>
    <div class="foot_save">
      <el-button
        type="primary"
        @click="submitinformation()"
        size="mini"
        v-if="isauth('package_edit')"
      >保存</el-button>
    </div>
    <!-- <div class="parameter_mian">
            <div class="billing_way">
              <div class="tslecet">
                <el-radio-group v-model="chargeType">
                  <el-radio label="0">按分钟计算</el-radio>
                  <el-radio label="1">按秒钟计算</el-radio>
                  <el-radio label="2">按次计算</el-radio>
                </el-radio-group>
              </div>
              <div class="introduced">1、按通话分钟计算时，则不足一分钟，按一分钟计；2、按次计算，每次通话产生固定费用；</div>
            </div>
            <div class="billing-unit">
                <div class="jjdw">费率:</div>
                <div class="minuteCost_css"><el-input v-model="minuteCost" size="mini"></el-input></div>
                <div class="jjdw-new">*单位:元,且最多保留两位小数。</div>
            </div>
    </div>-->
  </div>
</template>

<script>
export default {
  data() {
    return {
      form: {
        //计费方式
        chargeType: "",
        //计费单价
        minuteCost: "",
        //最大通话时间
        maximumCallTime: "",
        //开通亲情模式
        useFamilyNumber: false,
        //亲情号码最大数量
        familyNumberCount: "",
        //资费模式
        packageType: "",
        //月租金
        monthlyRent: "",
        //赠送方式
        freeWay: "",
        //月份
        jan01: false,
        feb02: false,
        mar03: false,
        apr04: false,
        may05: false,
        june06: false,
        july07: false,
        aug08: false,
        sept09: false,
        oct10: false,
        nov11: false,
        dec12: false,
        allowedStartTime: "00:00:00:00",
        allowedEndTime: "23:59:59:00",
        selfOrder: false,
        remark: "",
        operatorGuid: "",
        freeTime: 0,
      },
      //资费模式
      packageTypeoptions: [
        {
          value: "0",
          label: "实时扣费",
        },
        {
          value: "1",
          label: "套餐",
        },
      ],
      //赠送方式
      freeWayoptions: [
        {
          value: "0",
          label: "累计赠送",
        },
        {
          value: "1",
          label: "按月赠送",
        },
      ],
    };
  },
  created() {
    this.form.operatorGuid = sessionStorage.getItem("administrator");
  },
  computed: {
    changeschoolid: {
      get() {
        return this.$store.state.user.changeschoolid;
      },
    },
  },
  mounted() {
    this.shcoolinfoom();
  },
  methods: {
    // 限制输入框里面输入内容的函数 2位小数，e 为当前节点，name为需要更改的值
    keyupEvent(e, name) {
      e.target.value = e.target.value.replace(/[^\d.]/g, "");
      e.target.value = e.target.value.replace(/\.{2,}/g, ".");
      e.target.value = e.target.value.replace(/^\./g, "0.");
      e.target.value = e.target.value.replace(
        /^\d*\.\d*\./g,
        e.target.value.substring(0, e.target.value.length - 1)
      );
      e.target.value = e.target.value.replace(/^0[^\.]+/g, "0");
      e.target.value = e.target.value.replace(/^(\d+)\.(\d\d).*$/, "$1.$2");
      this.form[name] = e.target.value;
    },

    shcoolinfoom() {
      this.$http({
        url: this.$http.adornUrl("/voip/agent/unit-package"),
        method: "post",
        data: this.$http.adornData({
          messageContent: this.changeschoolid,
          messageType: this.messageType,
        }),
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          console.log(data);
          this.form.allowedEndTime = data.messageContent.allowedEndTime;
          this.form.allowedStartTime = data.messageContent.allowedStartTime;
          this.form.chargeType = data.messageContent.chargeType.toString();
          this.form.packageType = data.messageContent.packageType.toString();
          this.form.freeWay = data.messageContent.freeWay.toString();
          this.form.freeTime = data.messageContent.freeTime;
          this.form.apr04 = data.messageContent.apr04;
          this.form.aug08 = data.messageContent.aug08;
          this.form.jan01 = data.messageContent.jan01;
          this.form.feb02 = data.messageContent.feb02;
          this.form.mar03 = data.messageContent.mar03;
          this.form.may05 = data.messageContent.may05;
          this.form.june06 = data.messageContent.june06;
          this.form.july07 = data.messageContent.july07;
          this.form.sept09 = data.messageContent.sept09;
          this.form.oct10 = data.messageContent.oct10;
          this.form.nov11 = data.messageContent.nov11;
          this.form.dec12 = data.messageContent.dec12;

          this.form.minuteCost = data.messageContent.minuteCost;
          this.form.monthlyRent = data.messageContent.monthlyRent;
          this.form.remark = data.messageContent.remark;
          this.form.selfOrder = data.messageContent.selfOrder;
          this.form.useFamilyNumber =
            data.messageContent.useFamilyNumber == 1 ? true : false;
          this.form.maximumCallTime = data.messageContent.maximumCallTime;
          this.form.familyNumberCount = data.messageContent.familyNumberCount;
        } else {
          this.$message.error(data.errorMessage);
        }
      });
    },
    submitinformation() {
      this.form.unitGuid = this.changeschoolid;
      //  this.form.useFamilyNumber==true?1:0
      //  this.form.useFamilyNumber===true ? 1 : 0
      if (this.form.useFamilyNumber) {
        this.form.useFamilyNumber = 1;
      } else {
        this.form.useFamilyNumber = 0;
      }
      this.form.chargeType = parseInt(this.form.chargeType);
      this.form.minuteCost = Math.floor(this.form.minuteCost * 10000) / 10000;
      this.form.freeWay = parseInt(this.form.freeWay);
      this.form.packageType = parseInt(this.form.packageType);
      this.form.selfOrder == "0" ? false : true;
      this.form.freeTime = parseInt(this.form.freeTime);
      //  this.form.allowedEndTime.length<8?this.form.allowedEndTime+':'+'00' : this.form.allowedEndTime,
      //  this.form.allowedStartTime.length<8?this.form.allowedStartTime+':'+'00' : this.form.allowedStartTime,
      this.$http({
        url: this.$http.adornUrl("/voip/agent/update-unit-package"),
        method: "post",
        data: this.$http.adornData({
          messageContent: this.form,
          messageType: 0,
        }),
      }).then(({ data }) => {
        if (data.messageCode == 500) {
          this.$message.error(data.errorMessage);
        }
        if (data.messageCode == 200) {
          this.$message({
            message: data.messageContent,
            type: "success",
          });
          this.shcoolinfoom();
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.school_rate_setting {
  padding: 20px;
  .header_title {
    height: 40px;
    font-size: 18px;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
    > span {
      padding-bottom: 10px;
    }
  }
  .parameter_mian /deep/ .el-form-item--medium .el-form-item__content,
  .el-form-item--medium .el-form-item__label {
    line-height: 50px;
  }
  .parameter_mian /deep/ .el-form-item__label {
    margin-top: 7px;
  }
  .parameter_mian /deep/ .el-form-item {
    margin-bottom: 0px;
  }
  .parameter_mian .monselcet /deep/ .el-checkbox {
    margin-right: 5px;
    margin-left: 5px;
  }
  .parameter_mian {
    margin-top: 10px;
    .el-radio + .el-radio {
      margin-left: 0px;
    }

    .introduced {
      margin-left: 20px;
      color: #ccc;
    }
    .jjdw-new,
    .dwfz {
      margin-right: 15px;
      color: red;
      margin-left: 20px;
    }
  }
  .foot_save {
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
</style>